<%@page import="net.sf.json.JSONArray"%>
<%@page import="com.yunhuakeji.wddx.utils.IsNull"%>
<%@page import="net.sf.json.JSONObject"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
JSONObject result;
String totle = "";
String rank = "";
JSONArray jl=null ;
//pie
JSONArray data=null ;
JSONArray data1=null;
JSONArray x = null;
try{
	result = JSONObject.fromObject(request.getAttribute("result")); 
	System.out.println(result);

	if(IsNull.isNotNull(result.toString())){
		totle = result.getString("total");
		rank = result.getString("jg");
		jl = result.getJSONArray("describe");
		System.out.println(jl);
		data = result.getJSONObject("pie_data").getJSONArray("series_data");
		data1 = result.getJSONObject("line_data").getJSONArray("series_data");
		x = result.getJSONObject("line_data").getJSONArray("xAxis_data");
	}
}catch (Exception e) {
	e.printStackTrace();
	result = null;
	jl = null;
	}
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>消费报告</title>
     <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<link rel="stylesheet" type="text/css" href="css/myreport.css">
	<link rel="stylesheet" type="text/css" href="css/selectStyle.css">
	<script src="js/jquery.min.js"></script>
	<script src="js/selectCustom.js"></script>
	<script src="js/highcharts.js"></script>
	<script src="js/myReport.js"></script>
	<script src="js/layer.js"></script>
  </head>
  <%if(IsNull.isNotNull(result.toString())){ %>
  <body>
    	<div class="report-header">
    		<div class="report-header-container">
    			<div class="report-col-1 pl5 pr5">< </div>
    			<div class="report-col-8 pl5 pr5">
    					<select class="custom" onchange="getScores(this);">
	    				</select>
    			</div>
    			<div class="report-col-1 pl5 pr5"></div>
    		</div>
    		<div class="clear"></div>
    	</div>
    	<div class="report-menu">
    		<div class="border-bot-dotted">
    			<div>本学期共计花费<span class="color-red" id="totle"></span>元</div>
    			<div class="mt20 text-center">
    				<div class="mt20"><a>消费金额分析</a></div>
    				<div class="mt20" id="tglPic">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_01.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    					<img src="images/cjbg_03.png">
    				</div >
    				<div class="mt20"><a>你的消费水平高于全校<span class="color-red" id="rank"></span>的同学</a></div>
    				<div class="mt20 text-left gray"> 结论 : <span class="jl"><!--你的消费除于我校的低消费水平，如果你是因为家庭经济困难导致低消费，我们建议你向学校提供平困申请材料，只要情况属实，我们会尽力帮助你！ --></span></div>
    			</div>
    		</div>
    		<div>
    			<div class="mt10 text-center">
    				<!-- <div><a>消费类型分析</a></div> -->
    				<div id="xfchart"></div>
    				<div class="text-left gray">结论 : <span class="jl"><!-- 你是一个不折不扣的食堂空，虽然食堂味道深受吐槽，但你还是坚持在此消费，说明你具有坚强意志力，也说明你热爱自己的校园，总结：哥吃的不是食堂，是情怀！ --></span></div>
    			</div>
    		</div>
    		<div>
    			<div class="mt10 text-center">
    				<!-- <div><a>消费类型分析</a></div> -->
    				<div id="xfchart1"></div>
    				<div class="text-left gray"><span class="jl">结论 : <!-- 你的消费处于平稳状态！ --></span></div>
    			</div>
    		</div>
    	</div>
  <script>
  
  		var user_id = '<%=request.getParameter("userid")%>';
	var user_name = '<%=session.getAttribute("username")%>';
	var faceaddress = '<%=session.getAttribute("faceaddress")%>';
	var ticket = '<%=request.getParameter("ticket")%>';
	
//获取学期下拉列表
$.ajax({
		url:'reportapp/getReportByCostOptions.action?userid='+user_id+'&ticket='+ticket,
		type:'get',
		dataType:'json',
		success:function(data){
			$.each(data.content.message.items,function(i,r){
				var html = '<option value='+r["rm_xq"]+'>'+r["xnxq"]+'</option>';
				$('.custom').append(html);
			});
			//修改下拉选框的样式
	 		$(".custom").selectCustom({'divclasses':'position-absolute-center'});
		}
	});
 //创建myreport对象
 var report = new myReport();
 //控制课程通过率百分比
//var tgl=0.6; //通过率
 var imgs = $("#tglPic img");
 //report.setTglPic(imgs,tgl); 
 //页面数据
 var pageDate = {totle:'',rank:'',jl:''}
 	pageDate.totle = '<%=totle%>';
 	pageDate.rank = '<%=rank%>';
 	pageDate.jl = <%=jl %>;
 //饼图数据
 var datas = {format:'',data:'',pointFormat:'',domId:'',title:''};
 	datas.format = "<b>{point.name}</b>: {point.y}元";
 	datas.pointFormat = "总数:<b>{point.y}元 <br>{series.name} <b>{point.percentage:.1f}%<br>";
 	datas.domId = "xfchart";
 	datas.title = "消费类型分析";
 	datas.data = <%=data%>;
 //折线图数据
 var datas1 = {format:'',data:'',pointFormat:'',domId:'',title:'',x:''};
 	datas1.domId = "xfchart1";
 	datas1.title = "消费类型分析";
 	datas1.data = <%=data1%>;
 	datas1.x = <%=x%>;
 loadPage(pageDate, datas,datas1)
 //ajax加载数据切换页面
 function loadPage(pageDate,datas,datas1){
 	for(i in pageDate){
 		if(i == "jl"){
 			$.each($(".jl"),function(n,r){
 				$(r).text(pageDate.jl[n]);
 			});
 		}
 		$("#"+i).text(pageDate[i]);
 	}
 	//绑定通过率图片
 	report.setTglPic(imgs,pageDate.rank);
 	//绑定饼图
 	report.createChart(datas);
 	//绑定折现图
 	report.createZChart(datas1);
 }
 //按年份切换数据
function getScores(a){
	$.ajax({
	 		url:'reportapp/getReportByCostJson.action?userid=11204050220&rm_xq='+$(a).val()+'&ticket='+ticket,
	 		type:'get',
	 		dataType:'json',
	 		beforeSend:function(){
	 			layer.open({
				  type:2,
				  content:'加载中',
				  shade: 'background-color: rgba(0,0,0,0.2)'
				});
		 	},
	 		success:function(data){
	 			layer.closeAll();
				 //页面数据
				 var pageDate = {totle:'',rank:'',jl:''}
				 	pageDate.totle = data["total"];
				 	pageDate.rank = data["jg"];
				 	pageDate.jl = data["describe"];
				 //饼图数据
				 	datas.data = data["pie_data"]["series_data"];
				 //折线图数据
				 	datas1.data = data["line_data"]["series_data"];
				 	datas1.x =  data["line_data"]["xAxis_data"];
				 loadPage(pageDate, datas,datas1);
	 		},
	 		error:function(){
	 			layer.closeAll();
	 			 layer.open({
				    content: '网络异常'
				    ,skin: 'msg'
				    ,time: 2 //2秒后自动关闭
				  });
	 		}
	 	});
}
  </script>
   <%}else{ %>
       <div class="noData">
            <img alt="" src="img/noData.png">
            <div class="mt20">暂无数据</div>
       </div>
   <%} %>
  </body>
</html>
